<%@ page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>账号管理</title>
	<%@ include file="/view/common/tags.jsp"%>
	<script type="text/javascript" src="/js/My97DatePicker/WdatePicker.js"> </script>
</head>
<body>
    <section class="content">
        <div class="row">
            <div class="col-md-12">
                <div class="box">
                    <div class="box-body">
                       <div class="panel panel-default">
                            <div class="panel-body" style="padding-bottom:5px;">
                            	<input id="sourceListJson" type="hidden" value="${sourceListJson}" >
                            	<input id="gameNameListJson" type="hidden" value="${gameNameListJson}" >
                                <form class="form-horizontal" action="" method="post" id="dataForm">
                                	<div class="searchMenu">
                                	    <div>
	                                  	    <label>平台：</label>
	                                   		<sk:select cssClass="form-control select" name="wm[PLATFORM_TYPE]" id="platformType" value="" requiredInit="true" ajaxURL="${sysManagerV1}/baseType/select?wm[PARENT_ID]=20">
                                                <option value="">请选择</option>
                                            </sk:select>
	                                    </div>
	                                    <div>
	                                        <label>帐号：</label>
	                                        <input type="text" class="input" name="wm[_LIKE$USER_NAME]" vaule="${page.wm._LIKE$USER_NAME}"/>
	                                    </div>
                                        <div>
                                            <label>分配状态：</label>
                                            <sk:select cssClass="form-control select" name="wm[USER_STATUS]" id="userStatus" value="${page.wm.USER_STATUS}" >
                                                <option value="">请选择</option>
                                                <option value="0">未分配</option>
                                                <option value="1">已分配</option>
                                            </sk:select>
                                        </div>
                                        <div>
                                            <label>启用状态：</label>
                                            <sk:select cssClass="form-control select" name="wm[USER_ENABLE]" id="userEnable" value="${page.wm.USER_ENABLE}" >
                                                <option value="">请选择</option>
                                                <option value="0">启用中</option>
                                                <option value="1">已停用</option>
                                                <option value="2">异常</option>
                                            </sk:select>
                                        </div>
                                        <div>
                                            <label>异常原因：</label>
                                            <sk:select cssClass="form-control select" name="wm[FAIL_ID]" id="failId" value="${page.wm.FAIL_ID}" requiredInit="true" ajaxURL="${sysManagerV1}/pubgBaseReasons/reasonSelect?reasonTypeId=13">
                                                <option value="">请选择</option>
                                            </sk:select>
                                        </div>
	                                    <div class="mal10" >
	                                        <button type="button"  class="btn btn-primary btn-sm"  onclick="findData()"><span class='glyphicon glyphicon-search'></span>查&nbsp;询</button>
	                                        <button type="button" class="btn btn-primary btn-sm" onclick="showImportDiv()"><span class='glyphicon glyphicon glyphicon-transfer'></span>导&nbsp;入</button>
	                                    </div>
	                                    <div class="mal10" style="width: 100%">
	                                        <sk:button type="button" rightKey="1" _class="btn btn-success btn-sm" onclick="add(0)"><span class='glyphicon glyphicon-plus'></span>添&nbsp;加</sk:button>
	                                        <sk:button type="button" rightKey="1" _class="btn btn-primary btn-sm" onclick="accountAllot()"><span class='glyphicon glyphicon-import'></span>帐号分配</sk:button>
	                                        <sk:button type="button" rightKey="1" _class="btn btn-danger btn-sm" onclick="accountRecycle()"><span class='glyphicon glyphicon-log-in'></span>帐号重新分配</sk:button>
	                                    </div>
                                	</div>
                                </form>
                            </div>
                        </div>
                        <table class="table table-hover table-condensed table-bordered table-striped" id="dataTable" >
                            <thead>
                                <tr>
                                	<th data-field="index" data-align="center" data-formatter="indexFormatter" data-sortable="false">序号</th>
                                    <th data-field="platformType" data-align="center" data-sortable="true" data-formatter="platformTypeFormatter">平台</th>
                                    <th data-field="projectName" data-align="center" data-sortable="true">项目</th>
                                    <th data-field="userName" data-align="center" data-sortable="true">账号</th>
                                    <th data-field="userEmail" data-align="center" data-sortable="true">邮箱</th>
                                    <th data-field="emailPwd" data-align="center">邮箱密码</th>
                                    <th data-field="loginPwd" data-align="center">网站密码</th>
                                    <th data-field="payPwd" data-align="center">支付密码</th>
                                    <th data-field="userEnable" data-align="center" data-sortable="true" data-formatter="enableFormatter">启用状态</th>
                                    <th data-field="userStatus" data-align="center" data-sortable="true" data-formatter="statusFormatter">分配状态</th>
                                    <th data-field="kfAccount" data-align="center" data-sortable="true">被分配人</th>
                                    <th data-field="lastOptTime" data-align="center" data-sortable="true" data-formatter="updateTimeFormatter">分配时间</th>
                                    <th data-field="failReason" data-align="center" data-sortable="true" >异常原因</th>
                                    <th data-field="optButton" data-align="center" data-formatter="buttonFormatter">操作</th> 
                                </tr>
                            </thead>
                        </table>
                   	</div>
            	</div>
           	</div>
		</div>
    </section>
    <div id="importDiv" style="display: none;">
        <sk:form action="${ctx}/apiGameBaseRelation.do?method=improtApiGameBaseRelation" method="post" enctype="multipart/form-data" id="importForm" name="importForm">
            <input type="hidden" id="token" name="token" value="">
            <div style="margin-top: 20px; text-align: center;display:flex;padding:10px 0 0 30px ">
                <input type="text" id='textName' class="input" placeholder='请选择文件' style="width:200px;" vaule="">
                <input type="file" id="importExcel" name="importExcel"  style="margin:0 0 0 -230px;opacity:0;cursor:pointer;" onchange="showName()"/>
                <button type="button" class="btn btn-primary btn-sm" onclick="importData()"><span class='glyphicon glyphicon-import'></span>导入数据</button>
                <button type="button" class="btn btn-info btn-sm" onclick="exportTemplate()"><span class='glyphicon glyphicon-export'></span>导出模版</button>
            </div>
        </sk:form>
        <div id="resultDiv" style="margin: 10px 0 0 30px;font-size: 16px;"></div>
    </div>
   <%@ include file="/view/common/footer.jsp"%>
</body>
<script>

// 提示信息
var msgg='<%=request.getAttribute("msg")%>';
if( msgg && msgg!=null && msgg!='null'){ 
	  layer.msg(msgg);
}

// 加载table 数据
$(function(){
	$("#token").val(sessionStorage.getItem("token"));
	
    $("#dataTable").bootstrapTable({ 
    	url: "/cardUser/data",
    	method:"get", 
    	pagination:true,
    	sidePagination:"server",
    	queryParams: function(params) {
            return $.extend({}, params, parseJson(decodeURIComponent($("#dataForm").serialize())));     
        }
   }); 
 })

//查询
function findData(){
    $("#dataTable").bootstrapTable("refresh",{} );
}

// 平台名称格式化
function platformTypeFormatter(value, row, index) {
	var html = "启用";
	$("#platformType option").each(function(){  //遍历所有option    
        var val= $(this).val();   //获取option值     
        if(val == value){    
            html = $(this).text();
            return;
        }    
   });  
   return html;
}

// 启用状态格式化
function enableFormatter(value, row, index) {
	var html = "<span style='color:green'>启用</span>";
	if(value == 1){
		html = "<span style='color:red'>停用</span>";
	} else if(value == 2) {
		html = "<span style='color:#C4C400' title='" + row.failReason + "'>异常</span>";
	}
	return html;
}

// 分配状态格式化
function statusFormatter(value, row, index) {
	var html = "<span style='color:green'>未分配</span>";
	if(value == 1){
		html = "<span style='color:#0072E3'>已分配</span>";
		//var e = "<button id='btn_edit' type='button' onclick='_stop("+row.rowId+","+row.useFlag+",\""+row.staffName+"\");'    class='btn btn-default btn-sm'><span class='glyphicon glyphicon-ok'></span>回收</button>";
		//html = html+'&nbsp;'+e;
	}
	return html;
}

// 分配时间格式化
function updateTimeFormatter(value, row, index){
	var html = "";
	if(row.userStatus == 1){
		html = value;
	}
	return html;
}

//操作按钮
function buttonFormatter(value, row,index) {
	var e = "<button id='btn_edit' type='button' onclick='getCode("+row.rowId+","+row.platformType+");'  class='btn btn-default btn-sm'><span class='glyphicon glyphicon-pencil'></span>提取验证码</button>";
	var f = '<sk:button rightKey="20180817162830" id="btn_edit" type="button" _class="btn btn-default btn-sm" onclick="add('+row.rowId+');" jsText="true" value="<span class=\\\"glyphicon glyphicon-pencil\\\"><\\\/span>编辑"></sk:button>';
    return e + "&nbsp;" + f ;
}

// 获取谷歌验证码
function getCode(rowId,platformType){
	var token = sessionStorage.getItem("token");
            if (rowId == null || rowId == "") {
                layer.msg("id不能为空!");
                return;
            }
            $.post(JSSYSMANAGERV1 + "/cardUser/getGoogleCode?rowId="+rowId+"&token="+token+"&platformType="+platformType,null,function(json){
                if (json.code == 0) {
                    layer.alert("<span style='color:red;'>"+json.data +"</span>", {icon: 1});
                } else {
                    layer.msg("失败", {icon: 5});
                } 
            });
}

var tableIndex = 0;
// 弹出添加的窗口
function add(rowId){
	var titleBar = "添加账号";
    if (rowId != null && rowId > 0) {
        titleBar = "编辑账号";
    }
    tableIndex = layer.open({
        type: 2,
        title: titleBar,
        closeBtn: 1,
        shadeClose: true,
        area: ['500px', '450px'],
        content: '${sysManagerV1}/accountManage/toAdd?rowId='+rowId,
        btn: ["确 认","关 闭"],
        yes: function(index, layero){
            var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：
            iframeWin.add();
        }
    });
}

// 帐号分配
function accountAllot(){
	tableIndex = layer.open({
        type: 2,
        title: "帐号分配",
        closeBtn: 1,
        shadeClose: true,
        area: ['600px', '450px'],
        content: '${sysManagerV1}/accountManage/toAllot?flag=allot',
        btn: ["确 认","关 闭"],
        yes: function(index, layero){
            var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：
            iframeWin.allot();
        }
    });
}

// 帐号重新分配
function accountRecycle(){
	tableIndex = layer.open({
        type: 2,
        title: "帐号分配",
        closeBtn: 1,
        shadeClose: true,
        area: ['600px', '450px'],
        content: '${sysManagerV1}/accountManage/toAllot?flag=reAllot',
        btn: ["确 认","关 闭"],
        yes: function(index, layero){
            var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：
            iframeWin.allot();
        }
    });
}

// 显示导入窗口
function showImportDiv(){
	tableIndex = layer.open({
        type: 1,
        title: "导入",
        closeBtn: 1,
        shadeClose: true,
        area: ['500px', '210px'],
        content: $("#importDiv"),
        btn: ["关 闭"]
    });
}

// 显示选择文件
function showName(){
	$("#textName").val($("#importExcel").val());
}

// 导入数据
function importData(){
    if(!CheckUtil.isNotNull($("#importExcel").val())) {
		layer.msg("请选择导入文件");
	    $("#importExcel").focus();
	    return false;
	}
    
    $.ajax({
        url: "${sysManagerV1}/cardUser/importExcelData",
        type: "post",
        cache: false,
        data: new FormData($("#importForm")[0]),
        dataType:"json",
        processData: false,
        contentType: false,
        async:false,
        success: function(data) {
            $("#resultDiv").css("color", "green");
            if(data.code == 0){
                parent.layer.msg("导入成功！");
            } else if(data.code == "-2"){
                parent.window.location.href="${sysManagerV1}/";
            } else {
                parent.layer.msg(data.message);
                $("#resultDiv").css("color", "red");
            }
            $("#resultDiv").html(data.message);
        }
    });
}

function exportTemplate(){
	window.open("${sysManagerV1}/excel/CardAccountTemplate.xlsx");
}
</script>
</html>